<div class="tab-led-strip">
    <div class="content_wrapper">
        <div class="tab_title" i18n="tabLedStrip"></div>
        <div class="cf_doc_version_bt">
            <a id="button-documentation" href="" target="_blank" rel="noopener noreferrer"></a>
        </div>
        <div class="note">
            <p i18n="ledStripHelp"></p>
        </div>
        <div class="mainGrid"></div>
        <div class="gridSections">
            <div class="block"></div>
            <div class="block"></div>
            <div class="block"></div>
            <div class="block"></div>
            <div class="block"></div>
            <div class="block"></div>
            <div class="block"></div>
            <div class="block"></div>
            <div class="block"></div>
            <div class="block"></div>
            <div class="block"></div>
            <div class="block"></div>
            <div class="block"></div>
            <div class="block"></div>
            <div class="block"></div>
            <div class="block"></div>
        </div>
        <div class="controls">
            <div class="wires-remaining">
                <div></div>
                <span i18n="ledStripRemainingText"></span>
            </div>
            <button class="funcClear" i18n="ledStripClearSelectedButton"></button>
            <button class="funcClearAll" i18n="ledStripClearAllButton"></button>

            <div class="section" i18n="ledStripFunctionSection"></div>


            <div class="select">
                <span i18n="ledStripFunctionTitle"></span>
                <select id="ledStripFunctionSelect" class="functionSelect">
                    <option value="" i18n="ledStripFunctionNoneOption"></option>
                    <option value="function-c"  i18n="ledStripFunctionColorOption"></option>
                    <option value="function-f"  i18n="ledStripFunctionModesOption"></option>
                    <option value="function-a"  i18n="ledStripFunctionArmOption"></option>
                    <option value="function-l"  i18n="ledStripFunctionBatteryOption"></option>
                    <option value="function-s"  i18n="ledStripFunctionRSSIOption"></option>
                    <option value="function-g"  i18n="ledStripFunctionGPSOption"></option>
                    <option value="function-r"  i18n="ledStripFunctionRingOption"></option>
                    <option value="function-p"  i18n="ledStripFunctionGPSBarOption"></option>
                    <option value="function-e"  i18n="ledStripFunctionBatteryBarOption"></option>
                    <option value="function-u"  i18n="ledStripFunctionAltitudeOption"></option>
                </select>
            </div>


            <div class="modifiers">
                <span class="header" i18n="ledStripColorModifierTitle"></span>
                <div class="checkbox">
                    <input type="checkbox" name="ThrottleHue" class="toggle function-t" />
                    <label>
                        <select class="auxSelect">
                            <option value="0"  i18n="controlAxisRoll"></option>
                            <option value="1"  i18n="controlAxisPitch"></option>
                            <option value="2"  i18n="controlAxisYaw"></option>
                            <option value="3"  i18n="controlAxisThrottle"></option>
                            <option value="4"  i18n="controlAxisAux1"></option>
                            <option value="5"  i18n="controlAxisAux2"></option>
                            <option value="6"  i18n="controlAxisAux3"></option>
                            <option value="7"  i18n="controlAxisAux4"></option>
                            <option value="8"  i18n="controlAxisAux5"></option>
                            <option value="9"  i18n="controlAxisAux6"></option>
                            <option value="10"  i18n="controlAxisAux7"></option>
                            <option value="11"  i18n="controlAxisAux8"></option>
                        </select>
                        <span class="labelSelect" i18n="controlAxisThrottle"></span>
                    </label>
                </div>

                <div class="checkbox">
                    <input type="checkbox" name="LarsonScanner" class="toggle function-o" />
                    <label> <span i18n="ledStripLarsonOverlay"></span></label>
                </div>

                <div class="checkbox">
                    <input type="checkbox" name="blink" class="toggle function-b" />
                    <label> <span i18n="ledStripBlinkAlwaysOverlay"></span></label>
                </div>

                <div class="checkbox rainbowOverlay">
                    <input type="checkbox" name="Rainbow" class="toggle function-y" />
                    <label> <span i18n="ledStripRainbowOverlay"></span></label>
                    <div class="rainbowSlidersDiv">
                        <span i18n="ledStripRainbowDeltaSliderTitle"></span>
                        <div class="rainbowDeltaSlider">
                            <input type="range" min="0" max="359"/>
                            <label></label>
                            <div class="helpicon cf_tip" i18n_title="ledStripRainbowDeltaSliderHelp"></div>
                        </div>
                        <span i18n="ledStripRainbowFreqSliderTitle"></span>
                        <div class="rainbowFreqSlider">
                            <input type="range" min="1" max="360"/>
                            <label></label>
                            <div class="helpicon cf_tip" i18n_title="ledStripRainbowFreqSliderHelp"></div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="overlays">
                <span class="header" i18n="ledStripOverlayTitle"></span>
                <div class="checkbox warningOverlay">
                    <input type="checkbox" name="Warnings" class="toggle function-w" />
                    <label> <span i18n="ledStripWarningsOverlay"></span></label>
                </div>
                <div class="checkbox indicatorOverlay">
                    <input type="checkbox" name="Indicator" class="toggle function-i" />
                    <label> <span i18n="ledStripIndecatorOverlay"></span></label>
                </div>
                <div class="checkbox vtxOverlay">
                    <input type="checkbox" name="Vtx" class="toggle function-v" />
                    <label> <span i18n="ledStripVtxOverlay"></span></label>
                </div>
            </div>

            <div class="mode_colors">
                <div class="section" i18n="ledStripModeColorsTitle"></div>

                <select id="ledStripModeColorsModeSelect" class="modeSelect gps">
                    <option value="0" i18n="ledStripModeColorsModeOrientation"></option>
                    <option value="1" i18n="ledStripModeColorsModeHeadfree"></option>
                    <option value="2" i18n="ledStripModeColorsModeHorizon"></option>
                    <option value="3" i18n="ledStripModeColorsModeAngle"></option>
                    <option value="4" i18n="ledStripModeColorsModeMag"></option>
                    <option value="5" i18n="ledStripModeColorsModeBaro"></option>
                </select>

                <button class="mode_color-0-0 dir-n" i18n="ledStripDirN"></button>
                <button class="mode_color-0-1 dir-e" i18n="ledStripDirE"></button>
                <button class="mode_color-0-2 dir-s" i18n="ledStripDirS"></button>
                <button class="mode_color-0-3 dir-w" i18n="ledStripDirW"></button>
                <button class="mode_color-0-4 dir-u" i18n="ledStripDirU"></button>
                <button class="mode_color-0-5 dir-d" i18n="ledStripDirD"></button>
            </div>

            <div class="section" i18n="ledStripModesOrientationTitle"></div>
            <div class="directions">
                <button class="dir-n" i18n="ledStripDirN"></button>
                <button class="dir-e" i18n="ledStripDirE"></button>
                <button class="dir-s" i18n="ledStripDirS"></button>
                <button class="dir-w" i18n="ledStripDirW"></button>
                <button class="dir-u" i18n="ledStripDirU"></button>
                <button class="dir-d" i18n="ledStripDirD"></button>
            </div>

            <div class="colors">
                <div class="colorDefineSliders">
                    <div i18n="ledStripColorSetupTitle"></div>
                    <div class="colorDefineSliderContainer">
                        <Label class="colorDefineSliderLabel" i18n="ledStripH"></Label>
                        <input class="sliderHSV" type="range" min="0" max="359" value="0">
                        <Label class="colorDefineSliderValue Hvalue">0</Label>
                    </div>
                    <div class="colorDefineSliderContainer">
                        <Label class="colorDefineSliderLabel" i18n="ledStripS"></Label>
                        <input class="sliderHSV" type="range" min="0" max="255" value="0">
                        <Label class="colorDefineSliderValue Svalue">0</Label>
                    </div>
                    <div class="colorDefineSliderContainer">
                        <Label class="colorDefineSliderLabel" i18n="ledStripV"></Label>
                        <input class="sliderHSV" type="range" min="0" max="255" value="0">
                        <Label class="colorDefineSliderValue Vvalue">0</Label>
                    </div>
                </div>
                <button class="color-0" i18n_title="colorBlack">0</button>
                <button class="color-1" i18n_title="colorWhite">1</button>
                <button class="color-2" i18n_title="colorRed">2</button>
                <button class="color-3" i18n_title="colorOrange">3</button>
                <button class="color-4" i18n_title="colorYellow">4</button>
                <button class="color-5" i18n_title="colorLimeGreen">5</button>
                <button class="color-6" i18n_title="colorGreen">6</button>
                <button class="color-7" i18n_title="colorMintGreen">7</button>
                <button class="color-8" i18n_title="colorCyan">8</button>
                <button class="color-9" i18n_title="colorLightBlue">9</button>
                <button class="color-10" i18n_title="colorBlue">10</button>
                <button class="color-11" i18n_title="colorDarkViolet">11</button>
                <button class="color-12" i18n_title="colorMagenta">12</button>
                <button class="color-13" i18n_title="colorDeepPink">13</button>
                <button class="color-14" i18n_title="colorBlack">14</button>
                <button class="color-15" i18n_title="colorBlack">15</button>
            </div>

            <div class="special_colors mode_colors">
                <div class="section" i18n="ledStripModesSpecialColorsTitle"></div>

                <select id="ledStripModeGpsModeSelect" class="modeSelect flightmode">
                    <option value="0" i18n="ledStripModeGpsDefault"></option>
                    <option value="1" i18n="ledStripModeGpsBar"></option>
                </select>

                <button class="mode_color-6-0" i18n_title="colorGreen" i18n="ledStripModeColorsModeDisarmed"></button>
                <button class="mode_color-6-1" i18n_title="colorBlue" i18n="ledStripModeColorsModeArmed"></button>
                <button class="mode_color-6-2" i18n_title="colorWhite" i18n="ledStripModeColorsModeAnimation"></button>
                <!-- button class="mode_color-6-3" i18n_title="colorBlack">Background</button -->
                <button class="mode_color-6-4" i18n_title="colorBlack" i18n="ledStripModeColorsModeBlinkBg"></button>
                <button class="mode_color-6-5" i18n_title="colorRed" i18n="ledStripModeColorsModeGPSNoSats"></button>
                <button class="mode_color-6-6" i18n_title="colorOrange" i18n="ledStripModeColorsModeGPSNoLock"></button>
                <button class="mode_color-6-7" i18n_title="colorGreen" i18n="ledStripModeColorsModeGPSLocked"></button>
            </div>

            <div class="brightnessSliderDiv">
                <span i18n="ledStripBrightnessSliderTitle"></span>
                <div class="brightnessSlider">
                    <input type="range" min="5" max="100"/>
                    <label></label>
                    <div class="helpicon cf_tip" i18n_title="ledStripBrightnessSliderHelp"></div>
                </div>
            </div>

            <div class="section" i18n="ledStripWiring"></div>
            <div class="wiringMode">
                <button class="funcWire w100" i18n="ledStripWiringMode"></button>
            </div>
            <div class="wiringControls">
                <button class="funcWireClearSelect w50" i18n="ledStripWiringClearControl"></button>
                <button class="funcWireClear w50" i18n="ledStripWiringClearAllControl"></button>
            </div>
            <p i18n="ledStripWiringMessage"></p>
        </div>

        <div class="colorControls">

        </div>

        <div class="clear-both"></div>
    </div>
</div>
<div class="content_toolbar toolbar_fixed_bottom">
    <div class="btn save_btn">
        <a class="save" href="#" i18n="ledStripButtonSave"></a>
    </div>
</div>
